$(function(){
	$("#icon1").find("span").click(function(){
		$("#icon1 span").parents(".perfect").animate({
			"height":90
		},10);
		$("#icon1 span").html("隐藏↑")
	})
	
	$(".icon2").find("span").click(function(){
		$(".icon2 span").parents(".perfect").animate({
			"height":120
		},10);
		$(".icon2 span").html("隐藏↑")
	})
/*-------------鼠标经过小的人气的li的变化----------------*/	
	$(".price_v a").hover(function(){
		$(this).css("color","#14b3c9")
	},function(){
		$(this).css("color","#999")
	})
	
	$(".all_good a").hover(function(){
		$(this).css("color","#14b3c9")
		$(this).css("boder","1px solid #14b3c9")
	},function(){
		$(this).css("color","#999")
	})

/*-------------鼠标经过li的变化----------------*/
	
	$("li #package ").hover(function(){
		$(this).css({
			"height":297,
			"border":"2px solid orangered"
		})
		//a标签的字体颜色改变
		$(this).find(".big_a").css("color","#14b3c9");
		$(this).parent().css("border","1px solid #fff");
		//将p标签的高变高，显示隐藏的内容
		$(this).find("p").css({
			"height":50
		})
		//找到li，并且获得他的下标
		var index = $(this).parent().index();
		//改变li下的img图片
		$(this).find("img").attr("src","libs/img/list_img/"+(index+1)+"_225x225 (2).jpg");
	},function(){
		//找到a标签，并且将字体颜色改为灰色
		$(this).find(".big_a").css("color","#999");
		//将div的边框去掉
		$(this).css("border", "none");
		//将li的边框颜色改变
		$(this).parent().css("border","1px solid #dedfdf");
		//将p标签的高变小，隐藏多出的内容
		$(this).find("p").css({
			"height":25
		})
		//将div的高度变回原来的
		$(this).css({
			"height":280,
			"border":"none"
		})
		//改变li下的img图片
		var index = $(this).parent().index();
		$(this).find("img").attr("src","libs/img/list_img/"+(index+1)+"_225x225 (1).jpg");
	})
	
	
	
	
	
	
	
	/*------------------翻页效果-----------------------------*/
	/*---------------点击内容为首页的li------------------*/
	$("#page_1 li:eq(0)").click(function(){
		window.location.href = "index.html";
	})
	/*---------------点击内容为首页的li------------------*/
	$("#page_1 li:eq(2)").click(function(){
		window.location.href = "list.html";
	})
	/*---------------点击内容为2的li------------------*/
	$("#page_1 li:eq(3)").click(function(){
		$("#good ul").html("");
		$.ajax({
			type:"get",
			url:"backpage.json",
			async:true,
			dataType:"json",
			success:function(data){
				console.log(data);
				data.forEach(function(current){
//					console.log(current.contents_4);
					var _html = "<li><div id='package' class='div_height'><a href='#' class='big_a'><img src="+current.src+" />"
					+"<p>"+current.contents_1+"<span id='red'>"+current.contents_2+"</span>"+current.contents_3
					+"<span id='red'>"+current.contents_4+"</span>"
					+current.contents_5
					+"<span id='red'>"+current.contents_6+"</span>"
					+current.contents_7+"</p>"+
					"<span id='red'>"+current.price+"</span><span id='discount'>&nbsp;"
					+current.discount+"</span><span id='price_ncolor'>"+current.oldprice+"</span></a></div></li>";
					$("#good ul").append(_html);
				})
			}
		});
	})
	/*------------------ul后的翻页效果-----------------------------*/
	$("#count").createPage({
		pageCount:7,
		current:1,
		backFn:function(p){
			console.log(p)
		}
	})
	
	/*---------------结束标记----------------------*/
})